<template>
  <div>
    <el-row>
      <el-col :span="24">
        <div class="grid-title">
          <span>{{ title }}</span>
          <span
            class="cursor"
            @click="golist(listName)"
          >查看更多>>></span>
        </div>
      </el-col>
    </el-row>
    <el-table
      :data="list"
      stripe
      style="width: 100%"
    >
      <el-table-column prop="title">
        <template slot-scope="scope">
          <span
            class="tabDetail"
            @click="goDtaill(scope.row)"
          >{{ scope.row.name + '--' + scope.row.process_name + '--' + scope.row.node_name }}</span>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
export default {
  props: {
    title: {
      type: String,
      required: true
    },
    list: {
      type: Array,
      required: true
    },
    listName: {
      type: String,
      required: true
    },
    detailName: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      loading: false
    }
  },
  watch: {
    list: {
      handler(newlist) {
        this.list = newlist
      },
      deep: true
    }
  },
  created() {
    console.log(this.list)
  },
  methods: {
    golist() {
      this.$router.push({ name: 'before_process' })
    },
    goDtaill(row) {
      row.type = 'handle'
      this.$router.push({
        name: 'approve_process',
        params: { data: row,type:'before_process' }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.el-row {
  &:last-child {
    margin-bottom: 0;
  }
}
.grid-content {
  font-size: 14px;
  span {
    display: block;
    padding: 5px 2px;
  }
}
.cursor {
  cursor: pointer;
}
</style>
